<template>
  <div class="detail">
    <c-detail-header></c-detail-header>
    <c-detail-synopsis :companyMsg="companyMsg"></c-detail-synopsis>
    <c-detail-swiper :company_img="company_img" :company_headquarters="company_headquarters"></c-detail-swiper>
    <c-detail-about :companyMsg="companyMsg"></c-detail-about>
    <c-detail-evaluate :comments="comments"></c-detail-evaluate>
    <c-detail-conpanyqa :companyqa="companyqa"></c-detail-conpanyqa>

  </div>
</template>

<script>
import axios from "axios";
import { mapState } from 'vuex'

import cDetailHeader from "./components/Header";
import cDetailSynopsis from "./components/Synopsis";
import cDetailSwiper from "./components/Swiper";
import cDetailAbout from "./components/About";
import cDetailEvaluate from "./components/Evaluate";
import cDetailConpanyqa from "./components/Conpanyqa";


export default {
  name: "cDetail",
  components: {
    cDetailHeader,
    cDetailSynopsis,
    cDetailSwiper,
    cDetailAbout,
    cDetailEvaluate,
    cDetailConpanyqa
  },
  data() {
    return {
      company: "",
      companyMsg:{},
      company_img:[],
      company_headquarters:"",
      comments:[],
      companyqa:[]
    };
  },
  computed: {
  },
  methods: {
    getcDetailInfo() {
      axios.get("/api/cdetail.json?company=" + this.company).then(this.GetcDetailInfoSucc);
      axios.get("/api/comment.json?company=" + this.company).then(this.GetCommentSucc);
    },
    GetcDetailInfoSucc(res) {
      // console.log(res)
      if (res.status == 200 && res.data) {
        // console.log(res.data) 
        this.companyMsg = res.data
        this.companyqa = res.data.company_qa
        this.company_img = res.data.company_img
        this.company_headquarters = res.data.company_headquarters
      }
    },
    GetCommentSucc(res){
      if (res.status == 200 && res.data) {
        // console.log(res.data) 
        this.comments = res.data
      }
    }
  },
  activated() {
    this.company = this.$route.params.company
    this.getcDetailInfo();

  }
};
</script>

<style>
.detail{
  background: #ffffff;
}
</style>